<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
    <title>笔记本电脑展示</title>
    <link rel="shortcut icon" href="/img/logo.ico"/>

    <link rel="stylesheet" type="text/css" href="/css/all.css"/>
    <link rel="stylesheet" type="text/css" href="/css/pages-JD-index.css"/>
</head>

<body>
<!-- 头部栏位 -->
<!--页面顶部-->
<div id="nav-bottom">
    <!--顶部-->
    <div class="nav-top">
        <div class="top">
            <div class="py-container">
                <div class="shortcut">
                    <ul class="fl">
                        <li class="f-item">请<a href="/login"
                                               target="_blank">登录</a>　<span><a
                                href="/register"
                                target="_blank">免费注册</a></span>
                        </li>
                    </ul>
                    <!--头部-->
                    <div class="header">
                        <div class="py-container">
                            <div class="yui3-g Logo">
                                <div class="yui3-u Left logoArea">
                                    <a class="logo-bd" target="_blank"></a>
                                </div>
                                <div class="yui3-u Rit searchArea">
                                    <div class="search">
                                        <form action="/search/list" class="sui-form form-inline">
                                            <!--searchAutoComplete-->
                                            <div class="input-append">
                                                <input type="text" id="autocomplete" class="input-error input-xxlarge"
                                                       name="keywords"/>
                                                <button class="sui-btn btn-xlarge btn-danger" type="submit"><a>搜索</a>
                                                </button>
                                            </div>
                                        </form>
                                    </div>
                                </div>

                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--列表-->
<div class="py-container">
    <div class="yui3-g SortList">
        <div class="yui3-u Center banerArea">
            <!--banner轮播-->
            <div id="myCarousel" data-ride="carousel" data-interval="4000" class="sui-carousel slide">
                <ol class="carousel-indicators">
                    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                    <li data-target="#myCarousel" data-slide-to="1"></li>
                    <li data-target="#myCarousel" data-slide-to="2"></li>
                    <li data-target="#myCarousel" data-slide-to="3"></li>
                    <li data-target="#myCarousel" data-slide-to="4"></li>
                </ol>
                <div class="carousel-inner">
                    <div class="active item">
                        <a href="http://baidu2.wypxj.com/">
                            <img src="/img/_/LB1.jpg"/>
                        </a>
                    </div>
                    <div class="item">
                        <a href="http://baidu2.wypxj.com/">
                            <img src="/img/_/LB2.jpg"/>
                        </a>
                    </div>
                    <div class="item">
                        <a href="http://baidu2.wypxj.com/">
                            <img src="/img/_/LB3.jpg"/>
                        </a>
                    </div>
                    <div class="item">
                        <a href="http://baidu2.wypxj.com/">
                            <img src="/img/_/LB4.jpg"/>
                        </a>
                    </div>
                    <div class="item">
                        <a href="http://baidu2.wypxj.com/">
                            <img src="/img/_/LB5.jpg"/>
                        </a>
                    </div>
                </div>
                <a href="#myCarousel" data-slide="prev" class="carousel-control left">‹</a>
                <a href="#myCarousel" data-slide="next" class="carousel-control right">›</a>
            </div>
        </div>
    </div>
</div>
<!--品牌-->
<div>
    <div class="brandUl">
        <div th:each="br:${brandList}" class="brandLi">
            <div>
                <a th:href="@{${'/goods/listT'}(id=${br.id},page=${firstPage},size=${pageSize})}">
                    <img th:src="@{${br.image}}">
                </a>
                <span>
                    <a th:text="${br.name}"
                       th:href="@{${'/goods/listT'}(id=${br.id},page=${firstPage},size=${pageSize})}"></a>
                </span>
            </div>
        </div>
    </div>
</div>
<!--商品列表-->
<div class="goodsTable">
    <div th:each="gd:${goods}" class="goodsLi">
        <div>
            <img class="img" th:src="@{${gd.image}}">
        </div>
        <div class="goods-text">
            <div class="goodsIntroduction">
                <a th:text="${gd.introduction}"
                   th:href="'http://172.18.210.18:18085/page/findBy?id='+${gd.id}"></a>
            </div>
            <div class="goodsCommentNum">
                <strong><a th:text="${gd.commentNum}"></a>条评价</strong>
            </div>
        </div>
    </div>
</div>
<!--页面分页-->
<div class="clearfix">
    <div id="J_bottomPage" class="p-wrap">
        <span class="spanp">
            <a class="first-prev" th:href="@{${'/goods/list'}(page=${firstPage},size=${pageSize})}"
               title="使用方向键左键也可翻到首页哦！">
                <em>首页</em><i>&nbsp;</i>
            </a>
            <a class="pn-prev" th:href="@{${'/goods/list'}(page=${prePage},size=${pageSize})}"
               title="使用方向键左键也可翻到上一页哦！">
                <em>上一页</em><i>&nbsp;</i>
            </a>
            <a class="pn-next" th:href="@{${'/goods/list'}(page=${nextPage},size=${pageSize})}"
               title="使用方向键右键也可翻到下一页哦！">
                <em>下一页</em><i>&nbsp;</i>
            </a>
            <a class="last-prev" th:href="@{${'/goods/list'}(page=${lastPage},size=${pageSize})}"
               title="使用方向键左键也可翻到尾页哦！">
                <em>尾页</em><i>&nbsp;</i>
            </a>
        </span>
    </div>
</div>
</div>
<!-- 底部栏位 -->
<!--页面底部-->
<div class="clearfix footer">
    <div class="py-container">
        <div class="footlink">
            <div class="Mod-service">
                <ul class="Mod-Service-list">
                    <li class="grid-service-item intro  intro1">
                        <i class="serivce-item fl"></i>
                        <div class="service-text">
                            <h4>正品保障</h4>
                            <p>正品保障，提供发票</p>
                        </div>
                    </li>
                    <li class="grid-service-item  intro intro2">

                        <i class="serivce-item fl"></i>
                        <div class="service-text">
                            <h4>正品保障</h4>
                            <p>正品保障，提供发票</p>
                        </div>

                    </li>
                    <li class="grid-service-item intro  intro3">

                        <i class="serivce-item fl"></i>
                        <div class="service-text">
                            <h4>正品保障</h4>
                            <p>正品保障，提供发票</p>
                        </div>

                    </li>
                    <li class="grid-service-item  intro intro4">

                        <i class="serivce-item fl"></i>
                        <div class="service-text">
                            <h4>正品保障</h4>
                            <p>正品保障，提供发票</p>
                        </div>

                    </li>
                    <li class="grid-service-item intro intro5">

                        <i class="serivce-item fl"></i>
                        <div class="service-text">
                            <h4>正品保障</h4>
                            <p>正品保障，提供发票</p>
                        </div>

                    </li>
                </ul>
            </div>
            <div class="clearfix Mod-list">
                <div class="yui3-g">
                    <div class="yui3-u-1-6">
                        <h4>购物指南</h4>
                        <ul class="unstyled">
                            <li>购物流程</li>
                            <li>会员介绍</li>
                            <li>生活旅行/团购</li>
                            <li>常见问题</li>
                            <li>购物指南</li>
                        </ul>

                    </div>
                    <div class="yui3-u-1-6">
                        <h4>配送方式</h4>
                        <ul class="unstyled">
                            <li>上门自提</li>
                            <li>211限时达</li>
                            <li>配送服务查询</li>
                            <li>配送费收取标准</li>
                            <li>海外配送</li>
                        </ul>
                    </div>
                    <div class="yui3-u-1-6">
                        <h4>支付方式</h4>
                        <ul class="unstyled">
                            <li>货到付款</li>
                            <li>在线支付</li>
                            <li>分期付款</li>
                            <li>邮局汇款</li>
                            <li>公司转账</li>
                        </ul>
                    </div>
                    <div class="yui3-u-1-6">
                        <h4>售后服务</h4>
                        <ul class="unstyled">
                            <li>售后政策</li>
                            <li>价格保护</li>
                            <li>退款说明</li>
                            <li>返修/退换货</li>
                            <li>取消订单</li>
                        </ul>
                    </div>
                    <div class="yui3-u-1-6">
                        <h4>特色服务</h4>
                        <ul class="unstyled">
                            <li>夺宝岛</li>
                            <li>DIY装机</li>
                            <li>延保服务</li>
                            <li>品优购E卡</li>
                            <li>品优购通信</li>
                        </ul>
                    </div>
                    <div class="yui3-u-1-6">
                        <h4>帮助中心</h4>
                    </div>
                </div>
            </div>
            <div class="Mod-copyright">
                <ul class="helpLink">
                    <li>关于我们
                        <span class="space"></span>
                    </li>
                    <li>联系我们
                        <span class="space"></span>
                    </li>
                    <li>关于我们
                        <span class="space"></span>
                    </li>
                    <li>商家入驻
                        <span class="space"></span>
                    </li>
                    <li>营销中心
                        <span class="space"></span>
                    </li>
                    <li>友情链接
                        <span class="space"></span>
                    </li>
                    <li>关于我们
                        <span class="space"></span>
                    </li>
                    <li>营销中心
                        <span class="space"></span>
                    </li>
                    <li>友情链接
                        <span class="space"></span>
                    </li>
                    <li>关于我们</li>
                </ul>
                <p>地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100</p>
                <p>京ICP备08001421号京公网安备110108007702</p>
            </div>
        </div>
    </div>
</div>
<!--页面底部END-->
<!-- 楼层位置 -->
<div id="floor-index" class="floor-index">
    <ul>
        <li>
            <a class="num" href="javascript:;" style="display: none;">1F</a>
            <a class="word" href="javascript;;" style="display: block;">家用电器</a>
        </li>
        <li>
            <a class="num" href="javascript:;" style="display: none;">2F</a>
            <a class="word" href="javascript;;" style="display: block;">手机通讯</a>
        </li>
        <li>
            <a class="num" href="javascript:;" style="display: none;">3F</a>
            <a class="word" href="javascript;;" style="display: block;">电脑办公</a>
        </li>
        <li>
            <a class="num" href="javascript:;" style="display: none;">4F</a>
            <a class="word" href="javascript;;" style="display: block;">家居家具</a>
        </li>
        <li>
            <a class="num" href="javascript:;" style="display: none;">5F</a>
            <a class="word" href="javascript;;" style="display: block;">运动户外</a>
        </li>
    </ul>
</div>
<!-- 基础js库 -->
<script type="text/javascript" src="/js/all.js"></script>
<script type="text/javascript" src="/js/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/js/pages/index.js"></script>
</body>

</html>